<template>
	<view>
		<view class="margin_top xiaolv flexright margin_right" style="color: #28C445;"  @click="jumpurl('/pages/user/tuihuodd')">点击查看退货订单</view>
		<view class="ffffff margin_top">
			<view class="flexbetween mainpadding">
				<view class="bigtext flex2">商品名称1</view>
				<view class="bigtext flex2s">规格</view>
				<view class="bigtext flex1s">数量</view>
				<view class="bigtext flex1s">单价</view>
			</view>
			<view class="mainpadding2" v-for="(item,index) in dataAll.data" :key="index" @click="xgdjmx(item,index)">
				<view class="shangpin">
					<view class="flexbetween">
						<view class="nostrongtext flex2">{{item.goodsinfo.name}}</view>
						<view class="nostrongtext flex2s">{{item.goods_sku_name}}</view>
						<view class="strongtext flex1s">*{{item.num}}</view>
						<view class="strongtext flex1s">{{item.price}}</view>
					</view>
					<view class="margin_top">
						<view class="huisetext">备注：{{item.notes}}</view>
					</view>
					<!-- 赠品信息 -->
					<view class="flexbetween" v-if="item.send_num">
						<view class="huisetext flex2" style="color: #ffa126 ;">赠品备注：{{item.send_notes}}</view>
						<view class="nostrongtext flex2s" style="color: #ffa126 ;">{{item.goods_sku_name}}</view>
						<view class="strongtext flex1s" style="color: #ffa126 ;">*{{item.send_num}}</view>
						<view class="strongtext flex1s" style="color: #ffa126 ;">0</view>
					</view>
				</view>
			</view>
			<view class="flexbetween mainpadding2">
				<view class="littlesmall">合计：</view>
				<view class="littlesmall">{{hejiAll.goods_zl_num || 0}}种{{hejiAll.goods_num || 0}}</view>
				<view class="littlesmall" style="color: ##ffb800;">{{hejiAll.total_goods_price || 0}}元</view>
			</view>
		</view>
		<view class="mainpadding_top ffffff flexbetween">
			<view class="strongtext">配送方式（送货）</view>
			<u-radio-group v-model="dataAll.ps_type" placement="row" circle>
				<u-radio activeColor="#ffb800" :customStyle="{marginRight: '30rpx'}" label="自提" name="1"></u-radio>
				<u-radio activeColor="#ffb800" label="配送" name="2"></u-radio>
			</u-radio-group>
		</view>
		<view class="" style="padding-bottom: 150rpx;">
			<view class="ffffff mainpadding_top">
				<view class="titletext">备注</view>
				<textarea class="textarea mainpadding radius margin_top" placeholder="请输入退货单备注"
					v-model="dataAll.notes"></textarea>
			</view>
			<view class="mainpadding_top">
				<view class="flexcenter xiaohuang" @click="qingkong">清空单据</view>
				<view class="submitbtn margin_top" @click="submit">提交</view>
			</view>
		</view>
		<view class="ffffff dibu flexbetween">
			<view class="shuruk flexbetween">
				<input type="text" class="inputs" placeholder="输入商品名称/编号" disabled disabled="" @click="tianjia(1)">
				<view class="tianjia" @click="tianjia(2)">添加</view>
			</view>
			<uni-icons type="scan" size="28" color="#999999" @click="scanbarCode()"></uni-icons>
		</view>
	</view>
</template>

<script>
	const httpRequest = require('@/commonFun/httpRequest.js');
	export default {
		data() {
			return {
				dataAll: {
					ps_type: "1", //配送方式
					notes: "", //备注
					data: [],
				},
				ps_type:"1",
				hejiAll: {
					goods_zl_num:0,
					goods_num:0,
					total_goods_price:0
				},
			}
		},
		onShow() {
			if (uni.getStorageSync("tuihuodanInfo")) {
				this.dataAll = JSON.parse(uni.getStorageSync("tuihuodanInfo"))
				this.init()
			} else {
				this.refreshmsg()
			}
		},
		watch: {
			dataAll: {
				deep: true,
				handler(newval) {
					this.refreshmsg()
				}
			}
		},
		methods: {
			jumpurl(url) {
				uni.navigateTo({
					url
				})
			},
			// 提交单据
			submit() {
				if (!this.dataAll.data.length) {
					httpRequest.toast("请添加商品")
					return false
				}
				let data = JSON.parse(JSON.stringify(this.dataAll.data))
				data.forEach(item => {
					delete item.goodsinfo
					delete item.goods_sku_name
				})
				let tuihuodanInfo = {
					notes: this.dataAll.notes,
					ps_type: this.dataAll.ps_type,
					data,
				}
				httpRequest.request('/customapi/Salethorder/addSalethOrder', 'POST', tuihuodanInfo, false, false, true)
					.then(res => {
						httpRequest.toast(res.msg)
						if (res.code == 1) {
							this.dataAll.data = []
							this.dataAll.notes = ""
							this.refreshmsg()
							setTimeout(function() {
								uni.navigateBack(1)
							}, 500)
						}
					}).catch(err => {
						httpRequest.toast(err.msg);
					})
			},
			init() {
				let data = JSON.parse(JSON.stringify(this.dataAll.data))
				data.forEach(item => {
					delete item.goodsinfo
					delete item.goods_sku_name
				})
				let tuihuodanInfo = {
					ps_type: this.dataAll.ps_type,
					data,
				}
				httpRequest.request('/customapi/Salethorder/sure', 'POST', tuihuodanInfo, false, false, true).then(res => {
					this.hejiAll = res.data
				}).catch(err => {})
			},
			qingkong() {
				httpRequest.modal('提示', '确定清空单据吗？', true, (res) => {
					if (res) {
						uni.setStorageSync('tuihuodanInfo', "")
						httpRequest.toast("清除成功")
						setTimeout(function() {
							uni.navigateBack(1)
						}, 500)
					}
				})
			},
			//跳转添加商品页面
			tianjia(value) {
				let data = {
					type: 4,
					keyword: ""
				}
				uni.navigateTo({
					url: '/pages/index/sousuo?getmsg=' + encodeURIComponent(JSON.stringify(
						data))
				})
			},
			scanbarCode() {
				let that = this
				// 允许从相机和相册扫码
				uni.scanCode({
					success: function(res) {
						let data = {
							type: 4,
							keyword: res.result
						}
						uni.navigateTo({
							url: '/pages/index/sousuo?getmsg=' + encodeURIComponent(JSON.stringify(
								data))
						})
					},
					fail(err) {
						console.log('错误信息：' + err);
					}
				});
			},
			//跳转修改单据明细
			xgdjmx(item, index) {
				let obj = {
					type: 4,
					item,
					index
				}
				uni.navigateTo({
					url: '/pages/user/bianjisp?msg=' + encodeURIComponent(JSON.stringify(obj))
				})
			},
			// 数据刷新
			refreshmsg() {
				let _this = this
				uni.setStorageSync('tuihuodanInfo', JSON.stringify(this.dataAll))
			},
		}
	}
</script>

<style scoped>
	.flex1 {
		flex: 1;
		text-align: right;
	}

	.flex1s {
		flex: 1;
		text-align: center;
	}

	.flex2 {
		flex: 2;
	}

	.flex2s {
		flex: 2;
		text-align: center;
	}

	.textarea {
		box-sizing: border-box;
		width: 100%;
		background-color: #F8F8F8;
		height: 180rpx;
	}

	.huisetext {
		font-size: 24rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}

	/deep/.u-radio-group {
		flex: none !important;
	}

	.dibu {
		width: 100%;
		padding: 30rpx 30rpx;
		position: fixed;
		z-index: 1000;
		bottom: 0;
		left: 0;
		box-sizing: border-box;
	}

	.tianjia {
		height: 62rpx;
		width: 136rpx;
		background: rgba(11, 189, 203, .1);
		font-size: 28rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: ##ffb800;
		border-radius: 98px 98px 98px 98px;
	}

	.inputs {
		height: 62rpx;
		width: 70%;
		font-size: 28rpx;
		padding-left: 44rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}

	.shuruk {
		width: 90%;
		background: rgba(217, 217, 217, .2);
		border-radius: 74rpx;
	}
</style>